<template>
    <div>

        <el-form :model="ruleForm" :rules="rules" ref="addForm" label-width="50px" class="demo-ruleForm">
            <el-row :gutter="24">
                <el-col :span="12">
                    <img src="../../../../static/contract/1-4.png" style="height:auto; width:90%;"/>
                </el-col>

                <el-col :span="12">
                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="1." prop="bdzmc">
                                <el-input type="text" v-model="ruleForm.bdzmc" placeholder="标的总名称"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="11">
                            <el-form-item prop="zblj" label="2.">
                                <el-input type="text" v-model="ruleForm.zblj" placeholder="总保留价"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item prop="zqpj" label="3.">
                                <el-input type="text" v-model="ruleForm.zqpj" placeholder="总起拍价"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="11">
                            <el-form-item label="4." prop="zecblj">
                                <el-input type="text" v-model="ruleForm.zecblj" placeholder="总二次保留价"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="5." prop="zjdbfb">
                                <el-input type="text" v-model="ruleForm.zjdbfb" placeholder="总降低百分比"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="6." prop="pmfs">
                                <el-select v-model="ruleForm.pmfs" style="width:100%" placeholder="拍卖方式" clearable>
                                    <el-option
                                        v-for="item in this.auctionTypeOptions"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="11">
                            <el-form-item label="7." prop="wtpgr">
                                <el-input type="text" v-model="ruleForm.wtpgr" placeholder="委托评估人"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="8." prop="pgfycdr">
                                <el-input type="text" v-model="ruleForm.pgfycdr" placeholder="评估费用承担人"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="11">
                            <el-form-item label="9." prop="jdr">
                                <el-input type="text" v-model="ruleForm.jdr" placeholder="鉴定人"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="10." prop="jdfycdr">
                                <el-input type="text" v-model="ruleForm.jdfycdr" placeholder="鉴定费用承担人"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="11." prop="pmksrq">
                                <el-date-picker
                                v-model="ruleForm.pmksrq"
                                type="datetime"
                                placeholder="拍卖开始日期"
                                style="width: 100%;"
                                value-format="yyyy-MM-dd HH:mm:ss"
                                clearable>
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>   

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="12." prop="pmdd">
                                <el-input type="text" v-model="ruleForm.pmdd" placeholder="拍卖地点"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="13." prop="ggksrq">
                                <el-date-picker
                                v-model="ruleForm.ggksrq"
                                type="date"
                                placeholder="公告开始时间"
                                style="width: 100%;"
                                value-format="yyyy-MM-dd"
                                clearable>
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="14." prop="ggjsrq">
                                <el-date-picker
                                v-model="ruleForm.ggjsrq"
                                type="date"
                                placeholder="公告结束时间"
                                style="width: 100%;"
                                value-format="yyyy-MM-dd"
                                clearable>
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="15." prop="ggmtmc">
                                <el-input type="text" v-model="ruleForm.ggmtmc" placeholder="公告媒体名称"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="22">
                            <el-form-item label="16. 是否可以公告:" prop="sfkygg" label-width="140px">
                                <el-radio label="true" v-model="ruleForm.sfkygg">是</el-radio>
                                <el-radio label="false" v-model="ruleForm.sfkygg">否</el-radio>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row :gutter="24">
                        <el-col :span="13">
                            &nbsp;
                        </el-col>
                        <el-col :span="2">
                            <el-form-item>
                                <el-button type="primary" @click="submit">保存</el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>

                </el-col>
            </el-row>
        </el-form>
    </div>

</template>
<script>
import { getSelectData } from '@/api/dictionary';
export default {
    data () {
        return {
            ruleForm: {
                bdzmc: "",//标的总名称
                zblj: '',//总保留价
                zqpj: '',//总起拍价
                zecblj: '',//总二次保留价
                zjdbfb: '',//总降低百分比
                pmfs: "",//拍卖方式
                wtpgr: "",//委托评估人
                pgfycdr: "",//评估费用承担人
                jdr: "",//鉴定人
                jdfycdr: "",//鉴定费用承担人
                pmksrq: "",//拍卖开始日期
                pmdd: "",//拍卖地点
                ggksrq: "",//公告开始时间
                ggjsrq: "",//公告结束时间
                ggmtmc: '',//公告媒体名称
                sfkygg: 'true',//保留价与保证金是否可以公告

            },
            auctionTypeOptions: [],

            rules: {
                wtr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                bdzmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zblj: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zqpj: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmfs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmdd: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                ggksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                ggjsrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                sfkygg: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                zdjmrs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                sflhpm: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                jfr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jfjzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                jfdd: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jffs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                bgfcdr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jkzffs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                jkzfqx: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmccyy: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wscxz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                xdlhts: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wlhclfs: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wyzr: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zyjjxz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                zcwyhmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                rmfymc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                ydy: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yde: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yds: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                htksrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                htjsrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                wtrqz: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrkhh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrzh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrdh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                wtrqzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmrkhh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrzh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrdh: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmrqzrq: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                pmdw: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                pmje: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                remark: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                ggmtmc: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                yjzcjjbfb: [
                    { required: true, message: '请选择', trigger: 'change' }
                ],
                hlfybk: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                hlfyje: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
                hlfxzts: [
                    { required: true, message: '请输入', trigger: 'change' }
                ],
            }
        };
    },
    methods: {
        submit(){
            this.$refs.addForm.validate((valid) => {
                if(valid){
                    this.$emit('submit', this.ruleForm);
                }
                else{
                    this.$message.warning('注意必填项');
                    return ;
                }
            })
        },
        getData(){
            let data = '拍卖方式';
            getSelectData(data).then((res) => {
                if(res){
                    for(let item in res.data){
                        this.auctionTypeOptions.push({
                            label: res.data[item],
                            value: res.data[item]
                        })
                    }
                }
            })
        },
    },
    mounted(){
        this.getData();
    }

}
</script>
